Ext.require(['Ext.util.History'])
Ext.define('ProjectAON.controller.CRUD', {
    extend:'Ext.app.Controller',

    requires:[
        'ProjectAON.ux.ActivityMonitor',
        'Ext.window.MessageBox'
    ],

    stores:['VakKlas','ZelfPeerEvaluaties','CompetentieScore','VakkenSchooljaar','Schooljaar','Indicatoren','ControleScore', 'Hoofdcompetenties', 'Deelcompetenties', 'Subcompetenties', 'HoofdcompetentiesPerVak', 'DeelcompetentiesPerVak', 'SubcompetentiesPerVak'],
    models:['VakKlas','ZelfPeerEvaluaties','CompetentieScore','VakkenSchooljaar','Schooljaar','Indicatoren','ControleScore', 'Hoofdcompetenties', 'Deelcompetenties', 'Subcompetenties', 'HoofdcompetentiesPerVak', 'DeelcompetentiesPerVak', 'SubcompetentiesPerVak'],
    views:[
        'competentiesBeheren.Scherm26',
        'competentiesBeheren.Edit',
        'competentiesBeheren.Insert',
        'indicatorenBeheren.Edit',
        'indicatorenBeheren.Insert',
        'vakkenBeheren.InsertCompetentie',
        'vakkenBeheren.EditCompetentie',
        'Viewport'
    ],

    store:null,

    selection:null,

    isWidgetOpen:false,

    init:function () {
        this.control({
            'competentiesedit button[action=save]':{
                click:this.updateCompetenties
            },
            'competentiesadd button[action=save]':{
                click:this.insertCompetentie
            },
            'competentiesedit button[action=close]':{
                click:this.setWidgetClosed
            },
            'competentiesadd button[action=close]':{
                click:this.setWidgetClosed
            },
            'competentieVakadd button[action=save]':{
                click:this.insertCompetentieVak
            },
            'competentieVakadd button[action=close]':{
                click:this.setWidgetClosed
            },
            'competentieVakadd':{
                destroy:this.setWidgetClosed
            },
            'competentieVakEdit button[action=save]':{
                click:this.updateCompetentieVak
            },
            'competentieVakEdit button[action=close]':{
                click:this.setWidgetClosed
            },
            'competentieVakEdit':{
                destroy:this.setWidgetClosed
            },
            /*'searchgrid':{
             itemdblclick:this.showEditWidget
             },*/
            'competentiesedit':{
                destroy:this.setWidgetClosed
            },
            'competentiesadd':{
                destroy:this.setWidgetClosed
            },
            'scherm26 button[action=edit]':{
                click:this.showEditWidget
            },
            'scherm26 button[action=add]':{
                click:this.showAddWidget
            },
            'scherm26 button[action=remove]':{
                click:this.showRemoveCompetentie
            },
            'scherm26 button[action=unselect]':{
                click:this.unselect
            },
            'scherm26 grid':{
                itemmouseenter:this.fullView
            },
            'scherm26 grid':{
                itemclick:this.select
            },
            'scherm26 grid[action=deelcompetentie]':{
                itemclick:this.getDeelCompetentie
            },
            'scherm26 grid[action=subcompetentie]':{
                itemclick:this.getSubCompetentie
            },
            'scherm28 grid[action=deelcompetentiePerVak]':{
                itemclick:this.getDeelCompetentiePerVak
            },
            'scherm28 grid[action=subcompetentiePerVak]':{
                itemclick:this.getSubCompetentiePerVak
            },
            'scherm28 grid':{
                itemmouseenter:this.fullView
            },
            'scherm28 button[action=edit]':{
                click:this.showEditCompetentieWidget
            },
            'scherm28 button[action=add]':{
                click:this.showAddCompetentieWidget
            },
            'scherm28 button[action=remove]':{
                click:this.showRemoveCompetentieVak
            },
            'scherm34 grid':{
                itemmouseenter:this.fullView
            },
            'scherm34 grid[action=deelcompetentiePerVak]':{
                itemclick:this.getDeelCompetentiePerVak
            },
            'scherm34 grid[action=subcompetentiePerVak]':{
                itemclick:this.getSubCompetentiePerVak
            },
            'scherm37':{
                beforerender:this.loadSchooljaar
            },
            'scherm37 panel[action=schooljaar]':{
                afterrender:this.expandSchooljaar
            },
            'scherm43 grid[action=deelcompetentiePerVak]':{
                itemclick:this.getDeelCompetentiePerVak
            },
            'scherm43 grid[action=subcompetentiePerVak]':{
                itemclick:this.getSubCompetentiePerVak
            },
            'scherm43 grid[action=indicatorenPerVak]':{
                itemclick:this.getIndicatorenPerVak
            },
            'scherm43 grid':{
                itemmouseenter:this.fullView
            },
            'scherm43 button[action=edit]':{
                click:this.showEditIndicatorenWidget
            },
            'scherm43 button[action=add]':{
                click:this.showAddIndicatorenWidget
            },
            'scherm43 button[action=remove]':{
                click:this.showRemoveIndicatoren
            },
            'scherm46':{
                beforerender:this.loadZelfevaluatie
            },
            'scherm46 panel[action=zelfevaluatie]':{
                afterrender:this.expandZelfevaluatie
            },
            'indicatoradd slider':{
                changecomplete:this.setMinMax
            },
            'indicatoredit slider':{
                changecomplete:this.setMinMax
            },
            'indicatoradd button[action=save]':{
                click:this.insertIndicatoren
            },
            'indicatoradd button[action=close]':{
                click:this.setWidgetClosed
            },
            'indicatoredit button[action=save]':{
                click:this.updateIndicatoren
            },
            'indicatoredit button[action=close]':{
                click:this.setWidgetClosed
            },
            'scherm35 button[action=reset]':{
                click:this.resetScores
            }
        });
    },

    updateCompetenties:function (button) {
        var win = button.up('window'),
            form = win.down('form'),
            record = form.getRecord(),
            values = form.getValues();
        record.set(values);
        this.getSelectedTable();
        this.store.sync();
        win.close();
        this.isWidgetOpen = false;
    },

    updateCompetentieVak:function (button) {
        var win = button.up('window'),
            form = win.down('form'),
            record = form.getRecord(),
            values = form.getValues();
        values=Ext.Object.merge({},values,{vak:MySharedData.vak});

        this.getSelectedVakTable();
        this.store.sync();
        win.close();
        this.isWidgetOpen = false;
    },

    updateIndicatoren:function (button) {
        var win = button.up('window'),
            form = win.down('form'),
            record = form.getRecord(),
            zeerGoed=form.items.items[1].items.items[1].getValue(),
            goed=form.items.items[3].items.items[1].getValue(),
            voldoende=form.items.items[5].items.items[1].getValue(),
            onvoldoende=form.items.items[7].items.items[1].getValue();
        this.selection = Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().getSelection();
        values=Ext.Object.merge({},{vak:MySharedData.vak,competentieID:this.selection[0].data.omschrijving,zeerGoed:zeerGoed,goed:goed,voldoende:voldoende,onvoldoende:onvoldoende});
        this.store=this.getIndicatorenStore();
        record.set(values);
        this.store.sync();
        win.close();
        this.isWidgetOpen = false;
    },

    insertCompetentie:function (button) {
        var win = button.up('window'),
            form = win.down('form'),
            values = form.getValues();
        this.selection = null;
        this.store = null;
        this.selection = Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().getSelection();
        if (this.selection.length < 1) {
            this.selection = Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().getSelection();
            if (this.selection.length < 1) {
                this.store = this.getHoofdcompetentiesStore();
                values=Ext.Object.merge({},values,{niveau:1});
            }else{
                this.store = this.getDeelcompetentiesStore();
                values=Ext.Object.merge({},values,{parentID: this.selection[0].data.id, niveau:2});
            }
        }else{
            this.store = this.getSubcompetentiesStore();
            values=Ext.Object.merge({},values,{parentID: this.selection[0].data.id, niveau:3});
        }
        this.store.add(values);
        this.store.sync();
        this.store.reload();
        win.close();
        this.isWidgetOpen = false;
    },

    insertCompetentieVak:function (button) {
        var win = button.up('window'),
            form = win.down('form'),
            values = form.getValues();
        this.selection = Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().getSelection();
        this.store = this.getSubcompetentiesPerVakStore();
        if (this.selection.length < 1) {
            this.selection = Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().getSelection();
            this.store = this.getDeelcompetentiesPerVakStore();
            if (this.selection.length < 1) {
                this.store = this.getHoofdcompetentiesPerVakStore();
            }
        }
        values=Ext.Object.merge({},values,{vak:MySharedData.vak});
        this.store.add(values);
        this.store.sync();
        this.store.reload();
        win.close();
        this.isWidgetOpen = false;
    },

    insertIndicatoren:function(button){
        var win = button.up('window'),
            form = win.down('form'),
            zeerGoed=form.items.items[1].items.items[1].getValue(),
            goed=form.items.items[3].items.items[1].getValue(),
            voldoende=form.items.items[5].items.items[1].getValue(),
            onvoldoende=form.items.items[7].items.items[1].getValue();
        this.selection = Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().getSelection();
        values=Ext.Object.merge({},{vak:MySharedData.vak,competentieID:this.selection[0].data.id,zeerGoed:zeerGoed,goed:goed,voldoende:voldoende,onvoldoende:onvoldoende});
        this.store=this.getIndicatorenStore();
        this.store.add(values);
        this.store.sync();
        win.close();
        this.isWidgetOpen = false;
    },

    removeCompetentie:function (selection) {
        this.store.remove(selection);
        this.store.sync()
    },

    showMessageBox:function (title, text) {
        Ext.MessageBox.show({
            title:title,
            msg:text,
            buttons:Ext.MessageBox.OK,
            icon:Ext.MessageBox.INFO,
            minWidth:400,
            maxWidth:600
        });
    },

    showEditWidget:function () {
        if (!this.isWidgetOpen) {
            this.getSelectedTable();
            if (this.selection[0] != undefined) {
                var view = Ext.widget('competentiesedit');
                view.down('form').loadRecord(this.selection[0]);
                this.isWidgetOpen = true;
            } else {
                this.showMessageBox('Opmerking', 'Geen rij geselecteerd');
            }
        }
    },

    showEditCompetentieWidget:function () {
        if (!this.isWidgetOpen) {
            this.getSelectedTable();
            if (this.selection[0] != undefined) {
                var view = Ext.widget('competentieVakEdit');
                view.down('form').loadRecord(this.selection[0]);
                view.down('combo').store=this.store;
                this.isWidgetOpen = true;
            } else {
                this.showMessageBox('Opmerking', 'Geen rij geselecteerd');
            }
        }
    },

    showEditIndicatorenWidget:function () {
        if (!this.isWidgetOpen) {
            this.selection = Ext.ComponentQuery.query('#gridPanelIndicatoren')[0].getSelectionModel().getSelection();
            if (this.selection[0] != undefined) {
                var view = Ext.widget('indicatoredit');
                view.down('form').loadRecord(this.selection[0]);
                Ext.getCmp('sliderZG').setValue(this.selection[0].data.zeerGoed);
                Ext.getCmp('sliderG').setValue(this.selection[0].data.goed);
                Ext.getCmp('sliderV').setValue(this.selection[0].data.voldoende);
                Ext.getCmp('sliderO').setValue(this.selection[0].data.onvoldoende);
                this.setMinMax();
                this.isWidgetOpen = true;
            } else {
                this.showMessageBox('Opmerking', 'Geen rij geselecteerd');
            }
        }
    },

    showAddWidget:function () {
        if (!this.isWidgetOpen) {
            Ext.widget('competentiesadd');
            this.isWidgetOpen = true;
        }
    },

    showAddIndicatorenWidget:function () {
        if (!this.isWidgetOpen) {
            this.selection = Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().getSelection();
            if (this.selection[0] != undefined) {
                this.selection = Ext.ComponentQuery.query('#gridPanelIndicatoren')[0].store.data.items[0];
                if (this.selection == undefined) {
                    Ext.widget('indicatoradd');
                    this.isWidgetOpen = true;
                }else{
                    this.showMessageBox('Opmerking', 'Men kan maar 1 keer indicatoren toevoegen');
                }
            } else {
                this.showMessageBox('Opmerking', 'Geen rij geselecteerd');
            }
        }
    },

    //TODO de apart gemaakte functie gebruiken
    showAddCompetentieWidget:function () {
        if (!this.isWidgetOpen) {
            this.selection = null;
            this.store = null;
            this.selection = Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().getSelection();
            if (this.selection.length < 1) {
                this.selection = Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().getSelection();
                if (this.selection.length < 1) {
                    this.store = this.getHoofdcompetentiesStore();
                }else{
                    this.store = this.getDeelcompetentiesStore();
                    this.store.filter('parentID',this.selection[0].data.id);
                }
            }else{
                this.store = this.getSubcompetentiesStore();
                this.store.filter('parentID',this.selection[0].data.id);
            }
            var view=Ext.widget('competentieVakadd');
            view.down('combo').store=this.store;
            this.isWidgetOpen = true;
        }
    },

    showRemoveCompetentie:function () {
        var me = this;
        me.getSelectedTable();
        if (me.selection.length != 0) {
            Ext.MessageBox.show({
                title:'Bevestiging verwijdering',
                msg:'Wilt u verwijderen?',
                buttons:Ext.MessageBox.YESNO,
                buttonText:{yes:'Ja', no:'Neen'},
                icon:Ext.MessageBox.WARNING,
                minWidth:400,
                maxWidth:600,
                fn:function (btn) {
                    if (btn == 'yes') {
                        me.removeCompetentie(me.selection);
                    }
                }
            });
        } else {
            me.showMessageBox('Opmerking', 'Geen rij geselecteerd');
        }
    },

    showRemoveCompetentieVak:function () {
        var me = this;
        me.getSelectedVakTable();
        if (me.selection.length != 0) {
            Ext.MessageBox.show({
                title:'Bevestiging verwijdering',
                msg:'Wilt u verwijderen?',
                buttons:Ext.MessageBox.YESNO,
                buttonText:{yes:'Ja', no:'Neen'},
                icon:Ext.MessageBox.WARNING,
                minWidth:400,
                maxWidth:600,
                fn:function (btn) {
                    if (btn == 'yes') {
                        me.removeCompetentie(me.selection);
                    }
                }
            });
        } else {
            me.showMessageBox('Opmerking', 'Geen rij geselecteerd');
        }
    },

    showRemoveIndicatoren:function () {
        var me = this;
        this.selection = Ext.ComponentQuery.query('#gridPanelIndicatoren')[0].getSelectionModel().getSelection();
        this.store = this.getIndicatorenStore();
        if (me.selection.length != 0) {
            Ext.MessageBox.show({
                title:'Bevestiging verwijdering',
                msg:'Wilt u verwijderen?',
                buttons:Ext.MessageBox.YESNO,
                buttonText:{yes:'Ja', no:'Neen'},
                icon:Ext.MessageBox.WARNING,
                minWidth:400,
                maxWidth:600,
                fn:function (btn) {
                    if (btn == 'yes') {
                        me.removeCompetentie(me.selection);
                    }
                }
            });
        } else {
            me.showMessageBox('Opmerking', 'Geen rij geselecteerd');
        }
    },

    setWidgetClosed:function () {
        this.isWidgetOpen = false;
    },

    //TODO Alles beter samengooien, itemclick gebruiken om dit op te roepen
    getSelectedTable:function () {
        this.selection = null;
        this.store = null;
        this.selection = Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().getSelection();
        if (this.selection.length < 1) {
            this.selection = Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().getSelection();
            this.store = this.getDeelcompetentiesStore();
            if (this.selection.length < 1) {
                this.selection = Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().getSelection();
                this.store = this.getHoofdcompetentiesStore();
            }
        } else {
            this.store = this.getSubcompetentiesStore();
        }
    },

    getSelectedVakTable:function () {
        this.selection = null;
        this.store = null;
        this.selection = Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().getSelection();
        if (this.selection.length < 1) {
            this.selection = Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().getSelection();
            this.store = this.getDeelcompetentiesPerVakStore();
            if (this.selection.length < 1) {
                this.selection = Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().getSelection();
                this.store = this.getHoofdcompetentiesPerVakStore();
            }
        } else {
            this.store = this.getSubcompetentiesPerVakStore();
        }
    },

    fullView: function(grid, record, item, index, e){
        Ext.fly(item).set({ 'data-qtip': record.data.omschrijving });
    },

    getDeelCompetentie: function(grid, record, item, index, e){
        this.getDeelcompetentiesStore().clearFilter();
        this.getDeelcompetentiesStore().filter('parentID',record.data.id);
        this.getDeelcompetentiesStore().load();
        this.getSubcompetentiesStore().removeAll();
    },

    getSubCompetentie: function(grid, record, item, index, e){
        this.getSubcompetentiesStore().clearFilter();
        this.getSubcompetentiesStore().filter('parentID',record.data.id);
        this.getSubcompetentiesStore().load();
    },

    getDeelCompetentiePerVak: function(grid, record, item, index, e){
        this.getDeelcompetentiesPerVakStore().clearFilter();
        this.getDeelcompetentiesPerVakStore().filter('parentID',record.data.id);
        this.getDeelcompetentiesPerVakStore().getProxy().extraParams={vak:MySharedData.vak,tabel:'competentiespervak'};
        this.getDeelcompetentiesPerVakStore().load();
        this.getSubcompetentiesPerVakStore().removeAll();
    },

    getSubCompetentiePerVak: function(grid, record, item, index, e){
        this.getSubcompetentiesPerVakStore().clearFilter();
        this.getSubcompetentiesPerVakStore().filter('parentID',record.data.id);
        this.getSubcompetentiesPerVakStore().getProxy().extraParams={vak:MySharedData.vak,tabel:'competentiespervak'};
        this.getSubcompetentiesPerVakStore().load();
    },

    getIndicatorenPerVak: function(grid, record, item, index, e){
        this.store=this.getIndicatorenStore();
        this.store.clearFilter();
        this.selection = Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().getSelection();
        this.store.getProxy().extraParams={vak:MySharedData.vak,tabel:'indicatoren',competentieID:this.selection[0].data.id};
        this.store.load();
    },

    select: function(grid, record, item, index, e){
        var isSelected=grid.getSelectionModel().isSelected(index);
        var btn = Ext.getCmp("add");
        if(e.ctrlKey && isSelected){
            grid.getSelectionModel().doDeselect(index);
        };
        this.selection = Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().getSelection();
        if (this.selection.length < 1) {
            this.selection = Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().getSelection();
            if (this.selection.length < 1) {
                btn.setText('Hoofdcompetentie Toevoegen');
            }else{
                btn.setText('Deelcompetentie Toevoegen');
            }
        }else{
            btn.setText('Subcompetentie Toevoegen');
        }
    },
    unselect: function(grid, record, item, index, e){
        var btn = Ext.getCmp("add");
        var posHoofd = Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().getSelection();
        var posDeel = Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().getSelection();
        var posSub = Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().getSelection();
        Ext.ComponentQuery.query('#gridPanelHoofd')[0].getSelectionModel().doDeselect(posHoofd);
        Ext.ComponentQuery.query('#gridPanelDeel')[0].getSelectionModel().doDeselect(posDeel);
        Ext.ComponentQuery.query('#gridPanelSub')[0].getSelectionModel().doDeselect(posSub);
        btn.setText('Hoofdcompetentie Toevoegen');
    },

    //TODO MessageBOXES
    resetScores:function() {
        var me = this;
        var selected = Ext.ComponentQuery.query('#ScoreList')[0].getSelectionModel().getSelection();
        if(this.getControleScoreStore().isFiltered()) {
            if(selected.length < 1) {
                Ext.ComponentQuery.query('#ScoreList')[0].getSelectionModel().selectAll();
                selected = Ext.ComponentQuery.query('#ScoreList')[0].getSelectionModel().getSelection();
            }
            me.removeMultipleRows(selected);
        } else if(selected.length > 0) {
            me.removeMultipleRows(selected);
        }
    },

    removeMultipleRows:function(selected) {
        var rows = '';
        Ext.each(selected, function(selection, index) {
            rows += selection.data.id + ' ';
        });
        this.getControleScoreStore().getProxy().extraParams={rijen:rows};
        this.getControleScoreStore().remove(selected);
        this.getControleScoreStore().sync();
    },

    setMinMax:function(){
        Ext.getCmp('sliderG').setMaxValue(Ext.getCmp('sliderZG').getValue()-1);
        Ext.getCmp('sliderV').setMaxValue(Ext.getCmp('sliderG').getValue()-1);
        Ext.getCmp('sliderO').setMaxValue(Ext.getCmp('sliderV').getValue()-1);
        Ext.getCmp('sliderV').setMinValue(Ext.getCmp('sliderO').getValue()+1);
        Ext.getCmp('sliderG').setMinValue(Ext.getCmp('sliderV').getValue()+1);
        Ext.getCmp('sliderZG').setMinValue(Ext.getCmp('sliderG').getValue()+1);
        Ext.getCmp('lblMaxZG').setText(Ext.getCmp('sliderZG').maxValue);
        Ext.getCmp('lblMaxG').setText(Ext.getCmp('sliderG').maxValue);
        Ext.getCmp('lblMaxV').setText(Ext.getCmp('sliderV').maxValue);
        Ext.getCmp('lblMaxO').setText(Ext.getCmp('sliderO').maxValue);
        Ext.getCmp('lblMinZG').setText(Ext.getCmp('sliderZG').minValue);
        Ext.getCmp('lblMinG').setText(Ext.getCmp('sliderG').minValue);
        Ext.getCmp('lblMinV').setText(Ext.getCmp('sliderV').minValue);
        Ext.getCmp('lblMinO').setText(Ext.getCmp('sliderO').minValue);
        Ext.getCmp('lblZG').setText('Zeer goed: '+Ext.getCmp('sliderZG').getValue());
        Ext.getCmp('lblG').setText('Goed: '+Ext.getCmp('sliderG').getValue());
        Ext.getCmp('lblV').setText('Voldoende: '+Ext.getCmp('sliderV').getValue());
        Ext.getCmp('lblO').setText('Onvoldoende: '+Ext.getCmp('sliderO').getValue());
    },

    expandSchooljaar:function(panel){
        var me=this;
        var schooljaarKort=panel.id.substring(5);
        me.getVakkenSchooljaarStore().getProxy().extraParams={schooljaar:schooljaarKort};
        me.getVakkenSchooljaarStore().load(function(records) {
            Ext.getCmp(panel.id).removeAll();
            Ext.each(records, function(record) {
                var titlesVak='panel'+record.data.naam;
                Ext.getCmp(panel.id).add({
                    xtype: 'panel',
                    collapsed: true,
                    collapsible: true,
                    titleCollapse: true,
                    id:titlesVak,
                    cls:'colPanel',
                    flex: 2,
                    title: record.data.naam,
                    collapseMode: 'header'
                });
                var vak=record.data.naam;
                me.getHoofdcompetentiesPerVakStore().getProxy().extraParams={vak:vak};
                me.getHoofdcompetentiesPerVakStore().load(function(records) {
                    Ext.getCmp(titlesVak).removeAll();
                    Ext.each(records, function(record) {
                        if (record.data.niveau==1){
                            var titlesHoofdComp=titlesVak+'Hoofd'+record.data.id;
                            Ext.getCmp(titlesVak).add({
                                xtype: 'panel',
                                collapsed: true,
                                collapsible: true,
                                titleCollapse: true,
                                id:titlesHoofdComp,
                                cls:'hoofdCompPanel colPanel',
                                flex: 2,
                                title: record.data.omschrijving,
                                collapseMode: 'header',
                                layout:'accordion'
                            });
                            var parent=record.data.id;
                            me.getDeelcompetentiesPerVakStore().getProxy().extraParams={vak:vak};
                            me.getDeelcompetentiesPerVakStore().load(function(records) {
                                Ext.getCmp(titlesHoofdComp).removeAll();
                                Ext.each(records, function(record) {
                                    if (record.data.parentID==parent){
                                        var titlesDeelComp=titlesHoofdComp+'Deel'+record.data.id;
                                        var titlesGrid=titlesDeelComp+'Grid';
                                        var parentGrid=record.data.id
                                        Ext.getCmp(titlesHoofdComp).add({
                                            xtype: 'panel',
                                            collapsed: true,
                                            collapsible: true,
                                            id:titlesDeelComp,
                                            cls:'hoofdCompPanel colPanel',
                                            flex: 2,
                                            action:'openSub',
                                            title: record.data.omschrijving,
                                            collapseMode: 'header',
                                            items:[
                                                {
                                                    xtype: 'grid',
                                                    id:titlesGrid,
                                                    columns:[
                                                        {header:'Competentie', dataIndex:'omschrijving', flex:1},
                                                        {header:'cijfer', dataIndex:'cijfer', flex:1}
                                                    ],
                                                    store:'CompetentieScore'
                                                }
                                            ]
                                        });
                                    }
                                });
                            });
                        }
                    });
                });
            });
        });
    },

    loadSchooljaar:function(){
        this.getSchooljaarStore().load(function(records) {
            Ext.getCmp('panelSchooljaar').removeAll();
            Ext.each(records, function(record) {
                var titles='panel'+record.data.kort;
                Ext.getCmp('panelSchooljaar').add({
                    xtype: 'panel',
                    collapsed: true,
                    collapsible: true,
                    action:'schooljaar',
                    id:titles,
                    flex: 2,
                    title: record.data.lang,
                    collapseMode: 'header'
                });
            });
        });

    },

    loadZelfevaluatie:function(){
        this.getHoofdcompetentiesPerVakStore().getProxy().extraParams={vak: MySharedData.vak};
        this.getHoofdcompetentiesPerVakStore().load(function(records) {
            Ext.getCmp('panelZelfevaluatie').removeAll();
            Ext.each(records, function(record) {
                if (record.data.niveau==1){
                    var titlesHoofdComp='Hoofd'+record.data.id;
                    Ext.getCmp('panelZelfevaluatie').add({
                        xtype: 'panel',
                        collapsed: true,
                        collapsible: true,
                        action:'zelfevaluatie',
                        id:titlesHoofdComp,
                        flex: 2,
                        title: record.data.omschrijving,
                        collapseMode: 'header'
                    });
                }
            });
        });

    },

    expandZelfevaluatie:function(panel){
        var me=this;
        this.getHoofdcompetentiesPerVakStore().getProxy().extraParams={vak: MySharedData.vak};
        this.getHoofdcompetentiesPerVakStore().load(function(records) {
            Ext.getCmp('panelZelfevaluatie').removeAll();
            Ext.each(records, function(record) {
                if (record.data.niveau==1){
                    var titlesHoofdComp='Hoofd'+record.data.id;
                    Ext.getCmp('panelZelfevaluatie').add({
                        xtype: 'panel',
                        collapsed: true,
                        collapsible: true,
                        id:titlesHoofdComp,
                        flex: 2,
                        title: record.data.omschrijving,
                        collapseMode: 'header'
                    });
                    var parent=record.data.id;
                    me.getDeelcompetentiesPerVakStore().getProxy().extraParams={vak:MySharedData.vak};
                    me.getDeelcompetentiesPerVakStore().load(function(records) {
                        Ext.getCmp(titlesHoofdComp).removeAll();
                        Ext.each(records, function(record) {
                            if (record.data.parentID==parent){
                                Ext.getCmp(titlesHoofdComp).add({
                                    xtype: 'panel',
                                    collapsed: true,
                                    collapsible: true,
                                    cls:'hoofdCompPanel colPanel',
                                    flex: 2,
                                    title: record.data.omschrijving,
                                    collapseMode: 'header'
                                });
                            }
                        });
                    });
                }
            });
        });
    }
});
